@namespace blazor_wasm

<div class="container">
    <div class="jumbotron">
        <div class="row">
            <div class="col-md-6">
                <h1>Blazor-WASM-AOT-"keyed"</h1>
            </div>
            <div class="col-md-6">
                <div class="row">
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='run' @onclick="Run">Create 1,000 rows</button>
                    </div>
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='runlots' @onclick="Runlots">Create 10,000 rows</button>
                    </div>
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='add' @onclick="Add">Append 1,000 rows</button>
                    </div>
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='update' @onclick="Update">Update every 10th row</button>
                    </div>
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='clear' @onclick="Clear">Clear</button>
                    </div>
                    <div class="col-sm-6 smallpad">
                        <button type='button' class='btn btn-primary btn-block' id='swaprows' @onclick="SwapRows">Swap Rows</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <table class="table table-hover table-striped test-data">
        <tbody id="tbody">
            @foreach (var item in Data)
            {
                <tr @key="item.Id" class="@((item.Id == Selected ? "danger" : ""))">
                    <td class="col-md-1">@item.Id</td>
                    <td class="col-md-4">
                        <a href="#" @onclick="item.Select" @onclick:preventDefault>
                            @item.Label
                        </a>
                    </td>
                    <td class="col-md-1">
                        <a href="#" @onclick="item.Remove" @onclick:preventDefault>
                            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
                        </a>
                    </td>
                    <td class="col-md-6"></td>
                </tr>
            }
        </tbody>
    </table>
    <span class="preloadicon glyphicon glyphicon-remove" aria-hidden="true"></span>
</div>

